import 'package:flutter/material.dart';
import 'package:portal_website/pages/common_header.dart';
import 'package:portal_website/tool/image_network.dart';

class TalentCultivationPage extends StatelessWidget {
  const TalentCultivationPage({super.key});
  @override
  Widget build(BuildContext context) {
    // TODO: implement build

    return Scaffold(
      backgroundColor: const Color(0xFFF5F9FF),
      body: Container(
        margin: EdgeInsets.only(top: 50),
        child: SingleChildScrollView(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Breadcrumb(text: "首页 > 服务能力 > 人才培养"),

              PageTitle(
                  title: "人才培养", subtitle: "多层次、全方位的人才培养体系，助力企业数字化转型和人才升级"),
              // 内容区域
              Container(
                constraints: const BoxConstraints(maxWidth: 1200),
                padding: const EdgeInsets.all(20),
                child: Column(
                  children: [
                    // 介绍部分
                    const IntroSection(),

                    // 培养体系
                    const SystemSection(),

                    // 特色培养项目
                    const ProgramSection(),

                    // 师资力量
                    const FacultySection(),

                    // 成功案例
                    const CasesSection(),
                  ],
                ),
              ),

              // 页脚
              const Footer(
                email: 'talent@innovationservice.com',
              ),
            ],
          ),
        ),
      ),
    );
  }
}

// 导航链接组件
class NavLink extends StatelessWidget {
  final String text;
  NavLink({super.key, required this.text});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(left: 25),
      child: TextButton(
        onPressed: () {},
        style: TextButton.styleFrom(
          padding: EdgeInsets.zero,
          tapTargetSize: MaterialTapTargetSize.shrinkWrap,
        ),
        child: Text(
          text,
          style: const TextStyle(
            color: Colors.white,
            fontSize: 16,
          ),
        ),
      ),
    );
  }
}

// 介绍部分
class IntroSection extends StatelessWidget {
  const IntroSection({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      padding: const EdgeInsets.all(40),
      margin: const EdgeInsets.only(bottom: 40),
      child: Column(
        children: [
          SectionTitle(text: '人才培养介绍'),
          const SizedBox(height: 30),
          LayoutBuilder(
            builder: (context, constraints) {
              if (constraints.maxWidth > 768) {
                return Row(
                  children: [
                    Expanded(
                      child: Column(
                        children: const [
                          Text(
                            '在数字化转型浪潮下，企业对高素质人才的需求日益迫切。我们的人才培养服务旨在为企业和个人提供全方位的能力提升解决方案，助力企业打造核心竞争力，帮助个人实现职业发展目标。',
                            style: TextStyle(
                              color: Color(0xFF555555),
                              fontSize: 16,
                              height: 1.8,
                            ),
                            textAlign: TextAlign.justify,
                          ),
                          SizedBox(height: 20),
                          Text(
                            '我们的培养体系融合了行业前沿知识与实践案例，采用理论教学与实战训练相结合的方式，确保学员能够快速掌握实用技能，并应用于实际工作中。',
                            style: TextStyle(
                              color: Color(0xFF555555),
                              fontSize: 16,
                              height: 1.8,
                            ),
                            textAlign: TextAlign.justify,
                          ),
                        ],
                      ),
                    ),
                    const SizedBox(width: 40),
                    ClipRRect(
                      borderRadius: BorderRadius.circular(8),
                      child: ImageNetwork(
                        'https://via.placeholder.com/500x300?text=人才培养',
                        width: 500,
                        height: 300,
                        fit: BoxFit.cover,
                      ),
                    ),
                  ],
                );
              } else {
                return Column(
                  children: [
                    Column(
                      children: const [
                        Text(
                          '在数字化转型浪潮下，企业对高素质人才的需求日益迫切。我们的人才培养服务旨在为企业和个人提供全方位的能力提升解决方案，助力企业打造核心竞争力，帮助个人实现职业发展目标。',
                          style: TextStyle(
                            color: Color(0xFF555555),
                            fontSize: 16,
                            height: 1.8,
                          ),
                          textAlign: TextAlign.justify,
                        ),
                        SizedBox(height: 20),
                        Text(
                          '我们的培养体系融合了行业前沿知识与实践案例，采用理论教学与实战训练相结合的方式，确保学员能够快速掌握实用技能，并应用于实际工作中。',
                          style: TextStyle(
                            color: Color(0xFF555555),
                            fontSize: 16,
                            height: 1.8,
                          ),
                          textAlign: TextAlign.justify,
                        ),
                      ],
                    ),
                    const SizedBox(height: 20),
                    ClipRRect(
                      borderRadius: BorderRadius.circular(8),
                      child: ImageNetwork(
                        'https://via.placeholder.com/500x300?text=人才培养',
                        width: double.infinity,
                        height: 300,
                        fit: BoxFit.cover,
                      ),
                    ),
                  ],
                );
              }
            },
          ),
        ],
      ),
    );
  }
}

// 培养体系
class SystemSection extends StatelessWidget {
  const SystemSection({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      padding: const EdgeInsets.all(40),
      margin: const EdgeInsets.only(bottom: 40),
      child: Column(
        children: [
          SectionTitle(text: '培养体系'),
          const SizedBox(height: 10),
          const Text(
            '多层次、多领域的人才培养体系，满足不同阶段人才发展需求',
            style: TextStyle(
              color: Color(0xFF666666),
              fontSize: 16,
            ),
          ),
          const SizedBox(height: 30),
          GridView.count(
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            crossAxisCount: MediaQuery.of(context).size.width > 768 ? 3 : 1,
            crossAxisSpacing: 30,
            mainAxisSpacing: 30,
            childAspectRatio: 350 / 300,
            children: const [
              SystemCard(
                icon: '🎓',
                title: '基础能力培养',
                description: '针对初入职场或转行人员，提供基础技能和职业素养培训，包括编程基础、数据分析、沟通协作等通用能力。',
              ),
              SystemCard(
                icon: '💻',
                title: '专业技能提升',
                description: '针对有一定基础的从业人员，提供专业技术深度培训，包括人工智能、大数据、云计算等前沿技术领域。',
              ),
              SystemCard(
                icon: '👨‍💼',
                title: '领导力发展',
                description: '针对中高层管理人员，提供战略思维、团队管理、创新领导力等高阶能力培训。',
              ),
            ],
          ),
        ],
      ),
    );
  }
}

// 体系卡片
class SystemCard extends StatelessWidget {
  final String icon;
  final String title;
  final String description;

  const SystemCard({
    super.key,
    required this.icon,
    required this.title,
    required this.description,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: const Color(0xFFF9FBFF),
        borderRadius: BorderRadius.circular(8),
        border: Border.all(color: const Color(0xFFE0E9FF)),
      ),
      padding: const EdgeInsets.all(30),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            icon,
            style: const TextStyle(fontSize: 48),
          ),
          const SizedBox(height: 20),
          Text(
            title,
            style: const TextStyle(
              fontSize: 20,
              color: Color(0xFF1E5799),
              fontWeight: FontWeight.bold,
            ),
          ),
          const SizedBox(height: 15),
          Text(
            description,
            style: const TextStyle(
              color: Color(0xFF666666),
              fontSize: 15,
              height: 1.7,
            ),
          ),
        ],
      ),
    );
  }
}

// 特色培养项目
class ProgramSection extends StatelessWidget {
  const ProgramSection({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      padding: const EdgeInsets.all(40),
      margin: const EdgeInsets.only(bottom: 40),
      child: Column(
        children: [
          SectionTitle(text: '特色培养项目'),
          const SizedBox(height: 10),
          const Text(
            '针对不同领域和层次的人才培养项目，满足企业多样化人才需求',
            style: TextStyle(
              color: Color(0xFF666666),
              fontSize: 16,
            ),
          ),
          const SizedBox(height: 30),
          Column(
            children: const [
              ProgramItem(
                imageUrl: 'https://via.placeholder.com/300x200?text=AI人才培养',
                title: '人工智能精英培养计划',
                description:
                    '为期6个月的沉浸式培训，涵盖机器学习、深度学习、自然语言处理等核心技术，结合实际项目开发，培养具备实战能力的AI工程师。',
              ),
              ProgramItem(
                imageUrl: 'https://via.placeholder.com/300x200?text=数字化转型',
                title: '数字化转型领导力项目',
                description:
                    '专为企业中高层管理者设计的转型课程，内容包括数字化战略、组织变革、数据驱动决策等，帮助企业顺利实现数字化转型。',
              ),
            ],
          ),
        ],
      ),
    );
  }
}

// 项目项
class ProgramItem extends StatelessWidget {
  final String imageUrl;
  final String title;
  final String description;

  const ProgramItem({
    super.key,
    required this.imageUrl,
    required this.title,
    required this.description,
  });

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 30),
      child: LayoutBuilder(
        builder: (context, constraints) {
          if (constraints.maxWidth > 768) {
            return Row(
              children: [
                ClipRRect(
                  borderRadius: BorderRadius.circular(8),
                  child: ImageNetwork(
                    imageUrl,
                    width: 300,
                    height: 200,
                    fit: BoxFit.cover,
                  ),
                ),
                const SizedBox(width: 30),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        title,
                        style: const TextStyle(
                          fontSize: 20,
                          color: Color(0xFF1E5799),
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 15),
                      Text(
                        description,
                        style: const TextStyle(
                          color: Color(0xFF555555),
                          fontSize: 15,
                          height: 1.8,
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            );
          } else {
            return Column(
              children: [
                ClipRRect(
                  borderRadius: BorderRadius.circular(8),
                  child: ImageNetwork(
                    imageUrl,
                    width: double.infinity,
                    height: 200,
                    fit: BoxFit.cover,
                  ),
                ),
                const SizedBox(height: 20),
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      title,
                      style: const TextStyle(
                        fontSize: 20,
                        color: Color(0xFF1E5799),
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    const SizedBox(height: 15),
                    Text(
                      description,
                      style: const TextStyle(
                        color: Color(0xFF555555),
                        fontSize: 15,
                        height: 1.8,
                      ),
                    ),
                  ],
                ),
              ],
            );
          }
        },
      ),
    );
  }
}

// 师资力量
class FacultySection extends StatelessWidget {
  const FacultySection({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      padding: const EdgeInsets.all(40),
      margin: const EdgeInsets.only(bottom: 40),
      child: Column(
        children: [
          SectionTitle(text: '师资力量'),
          const SizedBox(height: 10),
          const Text(
            '汇聚行业专家和学术精英，打造高水平教学团队',
            style: TextStyle(
              color: Color(0xFF666666),
              fontSize: 16,
            ),
          ),
          const SizedBox(height: 30),
          GridView.count(
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            crossAxisCount: MediaQuery.of(context).size.width > 768 ? 4 : 2,
            crossAxisSpacing: 30,
            mainAxisSpacing: 30,
            childAspectRatio: 250 / 350,
            children: const [
              FacultyCard(
                imageUrl: 'https://via.placeholder.com/150x150?text=张教授',
                name: '张伟',
                title: '人工智能首席专家',
                description: '清华大学计算机系教授，国家人工智能重点实验室主任，发表论文200余篇。',
              ),
              FacultyCard(
                imageUrl: 'https://via.placeholder.com/150x150?text=李总监',
                name: '李明',
                title: '数字化转型专家',
                description: '前世界500强企业CIO，20年企业数字化转型经验，主导多个大型数字化项目。',
              ),
              FacultyCard(
                imageUrl: 'https://via.placeholder.com/150x150?text=王博士',
                name: '王芳',
                title: '大数据技术专家',
                description: '大数据领域资深研究员，主导开发多个大数据平台，拥有10余项技术专利。',
              ),
              FacultyCard(
                imageUrl: 'https://via.placeholder.com/150x150?text=赵总',
                name: '赵强',
                title: '创新管理专家',
                description: '知名创新管理咨询公司创始人，为多家企业提供创新战略咨询服务。',
              ),
            ],
          ),
        ],
      ),
    );
  }
}

// 师资卡片
class FacultyCard extends StatelessWidget {
  final String imageUrl;
  final String name;
  final String title;
  final String description;

  const FacultyCard({
    super.key,
    required this.imageUrl,
    required this.name,
    required this.title,
    required this.description,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: const Color(0xFFF9FBFF),
        borderRadius: BorderRadius.circular(8),
      ),
      padding: const EdgeInsets.all(20),
      child: Column(
        children: [
          CircleAvatar(
            radius: 75,
            backgroundImage: NetworkImage(imageUrl),
            backgroundColor: const Color(0xFFE0E9FF),
          ),
          const SizedBox(height: 15),
          Text(
            name,
            style: const TextStyle(
              fontSize: 18,
              color: Color(0xFF1E5799),
              fontWeight: FontWeight.bold,
            ),
          ),
          const SizedBox(height: 5),
          Text(
            title,
            style: const TextStyle(
              color: Color(0xFF207CCA),
              fontSize: 14,
            ),
          ),
          const SizedBox(height: 10),
          Text(
            description,
            textAlign: TextAlign.center,
            style: const TextStyle(
              color: Color(0xFF666666),
              fontSize: 14,
            ),
          ),
        ],
      ),
    );
  }
}

// 成功案例
class CasesSection extends StatelessWidget {
  const CasesSection({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      padding: const EdgeInsets.all(40),
      margin: const EdgeInsets.only(bottom: 40),
      child: Column(
        children: [
          SectionTitle(text: '成功案例'),
          const SizedBox(height: 10),
          const Text(
            '我们已为众多企业和个人提供了优质的人才培养服务',
            style: TextStyle(
              color: Color(0xFF666666),
              fontSize: 16,
            ),
          ),
          const SizedBox(height: 30),
          GridView.count(
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            crossAxisCount: MediaQuery.of(context).size.width > 768 ? 3 : 1,
            crossAxisSpacing: 30,
            mainAxisSpacing: 30,
            childAspectRatio: 300 / 330,
            children: const [
              CaseCard(
                imageUrl: 'https://via.placeholder.com/400x200?text=科技企业',
                title: '某科技企业AI人才培养',
                description: '为该企业定制AI人才培养计划，培养100名AI工程师，项目成果直接应用于企业产品研发。',
              ),
              CaseCard(
                imageUrl: 'https://via.placeholder.com/400x200?text=金融机构',
                title: '金融机构数字化转型培训',
                description: '为金融机构提供数字化转型系列培训，覆盖300名管理人员，助力企业数字化战略落地。',
              ),
              CaseCard(
                imageUrl: 'https://via.placeholder.com/400x200?text=高校合作',
                title: '高校新工科人才培养项目',
                description: '与5所高校合作开展新工科人才培养，共建10门课程，培养500名复合型人才。',
              ),
            ],
          ),
        ],
      ),
    );
  }
}

// 案例卡片
class CaseCard extends StatelessWidget {
  final String imageUrl;
  final String title;
  final String description;

  const CaseCard({
    super.key,
    required this.imageUrl,
    required this.title,
    required this.description,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(8),
        boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 15,
            offset: const Offset(0, 5),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          ImageNetwork(
            "",
            width: double.infinity,
            height: 200,
            fit: BoxFit.cover,
          ),
          Container(
            padding: const EdgeInsets.all(20),
            color: Colors.white,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  title,
                  style: const TextStyle(
                    fontSize: 18,
                    color: Color(0xFF1E5799),
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const SizedBox(height: 10),
                Text(
                  description,
                  style: const TextStyle(
                    color: Color(0xFF666666),
                    fontSize: 14,
                  ),
                ),
                const SizedBox(height: 15),
                TextButton(
                  onPressed: () {},
                  style: TextButton.styleFrom(
                    padding: EdgeInsets.zero,
                    tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                  ),
                  child: const Text(
                    '查看详情 →',
                    style: TextStyle(
                      color: Color(0xFF207CCA),
                      fontWeight: FontWeight.bold,
                      fontSize: 14,
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

// 页脚
class Footer extends StatelessWidget {
  final String email;

  const Footer({super.key, required this.email});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: const Color(0xFF1A1A2E),
        borderRadius: BorderRadius.circular(8),
      ),
      padding: const EdgeInsets.all(40),
      margin: const EdgeInsets.only(top: 50),
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            // flexWrap: FlexWrap,
            children: const [
              FooterLink(text: '关于我们'),
              FooterLink(text: '服务条款'),
              FooterLink(text: '隐私政策'),
              FooterLink(text: '帮助中心'),
              FooterLink(text: '联系我们'),
            ],
          ),
          const SizedBox(height: 20),
          const Text(
            '© 2025 创新服务平台 版权所有',
            style: TextStyle(
              color: Colors.white,
              fontSize: 14,
            ),
          ),
          const SizedBox(height: 10),
          Text(
            '地址：XX省XX市XX区XX路XX号 | 服务热线：400-123-4567 | 邮箱：$email',
            style: const TextStyle(
              color: Colors.white,
              fontSize: 14,
            ),
            textAlign: TextAlign.center,
          ),
        ],
      ),
    );
  }
}

// 页脚链接
class FooterLink extends StatelessWidget {
  final String text;

  const FooterLink({super.key, required this.text});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 20),
      child: TextButton(
        onPressed: () {},
        style: TextButton.styleFrom(
          padding: EdgeInsets.zero,
          tapTargetSize: MaterialTapTargetSize.shrinkWrap,
        ),
        child: Text(
          text,
          style: const TextStyle(
            color: Color(0xFFA8B2D1),
            fontSize: 14,
          ),
        ),
      ),
    );
  }
}

// 通用的 section title 组件
class SectionTitle extends StatelessWidget {
  final String text;

  const SectionTitle({super.key, required this.text});

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.only(bottom: 15),
      decoration: const BoxDecoration(
        border: Border(
          bottom: BorderSide(
            color: Color(0xFFF0F0F0),
            width: 2,
          ),
        ),
      ),
      child: Stack(
        children: [
          Text(
            text,
            style: const TextStyle(
              fontSize: 24,
              color: Color(0xFF1E5799),
              fontWeight: FontWeight.normal,
            ),
          ),
          Positioned(
            bottom: -2,
            left: 0,
            child: Container(
              width: 80,
              height: 2,
              color: const Color(0xFF207CCA),
            ),
          ),
        ],
      ),
    );
  }
}
